<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>浮动</title>
		<link href="css/new_file.css" rel="stylesheet"/>
	</head>
	<body>
		<!-- 传统的网页布局：标准流+浮动+定位
		标准流：标签的显示规则（显示模式）
		浮动：让块级盒子在一行内显示
		定位：实现标签在网页中精准定位 -->
		<!-- 浮动float:
		1.浮动的盒子会脱离标准流（脱标）
		清除浮动方法：
		1.额外标签法：隔墙法
		2.父级添加overflow:hidden属性
		3.父级添加after伪元素
		
		 -->
		 <div class="clearfix">
		<div class="box">1</div>
		<div class="box" style="">2</div>
		<div class="box">3</div>
		</div>
		<!-- <p class="clear"></p>  -->  <!-- 冗余代码 -->
		
		<div class="bufu">4</div>
		
	</body>
</html>
